<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>设置/获取dataSource</title>
    <script type="text/javascript" src="../../../jquery.js"></script>
    <script type="text/javascript" src="../../../ui/om-core.js"></script>
    <script type="text/javascript" src="../../../ui/om-suggestion.js"></script>
    <script type="text/javascript" src="../../common/js/data.js"></script>
    <script type="text/javascript" src="../../common/js/json2.js"></script>
    <link rel="stylesheet" type="text/css" href="../../../themes/default/om-all.css" />
    <link rel="stylesheet" type="text/css" href="../../common/css/demo.css" />
    <style>
    .itemFloatLeft {
        float: left
    }
    
    .itemFloatRight {
        float: right;
        color: #AAAAAA;
    }
    </style>
    <!-- view_source_begin -->
    <script type="text/javascript" >
        $(document).ready(function() {
            $('#txt').omSuggestion({
                dataSource : '../../../changeUrlSuggestionServlet.json',
                clientFormatter : function(data,index) {
                    return '<div class="itemFloatLeft">'+data.text+'</div><div class="itemFloatRight">约<font color="red">'+data.count+'</font>条记录</div>';
                }
            });
            $('#country').change(function() {
                var v = $('#country').val();
                $('#txt').omSuggestion("setData","../../../changeUrlSuggestionServlet.json?country="+v);
            });
            
            $('#getdataSource').click(function() {
                alert(JSON.stringify($('#txt').omSuggestion("getData")));
            });
        });
    </script>
    <!-- view_source_end -->

</head>
<body>
    <!-- view_source_begin -->
    <select id="country" class="abc">
        <option value="china">中国</option>
        <option value="france">法国</option>
        <option value="england">英国</option>
    </select>
    <input id="txt" style="width: 300px"/>
    <br />
    <input type="button" id="getdataSource" value="获取dataSource"/>
    <!-- view_source_end -->
    <div id="view-desc">
        通过setData方法动态改变请求数据的dataSource，通过getData可以获取dataSource(改变国家之后需要输入值才会加载数据，点击按钮才能获得值)。
    </div>
    <script type="text/javascript" src="../../common/js/themeloader.js"></script>
</body>
</html>